<md-toolbar style="background-image: url(./src/123.jpg)">
  <h2 style="text-align: center">
    <span style="color: GhostWhite ">就</span>
    <span style="color: GhostWhite ">叫</span>
    <span style="color: GhostWhite ">课</span>
    <span style="color: GhostWhite ">堂</span>
  </h2>
</md-toolbar>
  <div layout="column" layout-align="space-between center">
    <form>
      <div ng-show="!showQR">
      <md-input-container class="md-block">
        <!-- Use floating label instead of placeholder -->
        <label>用户名</label>
        <input required ng-model="username" type="text" >
      </md-input-container>
      <md-input-container class="md-block">
        <!-- Use floating label instead of placeholder -->
        <label>密码</label>
        <input ng-model="password" type="password" required>
        <div ng-message="required">
          {{flag}}
        </div>
      </md-input-container>
      <md-input-container class="md-block">
        <md-button ng-click="login()" class="md-raised" type="submit" id="loginBtn" ng-show="!showQR" style="width:100%">登录</md-button>
      </md-input-container>
    </div>
    </form>
    <img src="./src/qr.png" ng-show="showQR" alt="没有找到二维码"/>
  </div>
<div class="footer">
  <span ng-click="switchQR()" style="cursor:pointer; color: blue">QR code</span> 
  <a href="./src/help.html">Document</a>
  <span  style="cursor:pointer; color: blue" ng-click="display_new()">Update logs</span>
   <br>
  Copyright © 2016-2018 就叫课堂 Team. All Rights Reserved. <br>
  Developers: Yuan Yao, Jianjun zeng, Zhanbei Yu, Yifan Wang, Kui Xue <br>
</div>
<style>
  .footer {
    text-align: center;
  position:fixed;
  left:0;
  bottom:0;
  height:7em;
  width:100%;
}
</style>

